/* 根元素变量 */
body {
  --status-height: 0;
  background-color: #f8f8f8;
}
/* 全局元素 */
* {
  font-size: 12px;
  margin: 0;
  padding: 0;
}
/* 页面容器样式 */
.page,
.auto-page {
  display: flex;
  flex-direction: column;
  position: relative;
}
.page {
  height: 100vh;
  overflow: hidden;
}
.auto-page {
  min-height: calc(100vh - 50px);
}
/* 头部样式 */
.page-header {
  height: 50px;
  background-color: #f8f8f8;
  display: flex;
  flex-direction: column;
}
.plus-status {
  background-color: blue;
  width: 100%;
  height: var(--status-height);
}
/* 布局样式 */
.f-row,
.f-column {
  display: flex;
  position: relative;
}
.f-row {
  flex-direction: row;
}
.f-column {
  flex-direction: column;
}
/* 边距样式 */
.p-lr-5 {
  padding-left: 10px;
  padding-right: 10px;
}